<template>
  <div class="live">
    <iframe
      id="ifm"
      class="iframe"
      ref="iframe"
      :src="src"
      @load="loaded"
      allow="microphone;camera;midi;encrypted-media;fullscreen;speaker;display-capture;picture-in-picture;autoplay;"
      allowfullscreen="true"
    ></iframe>
  </div>
</template>

<script>
import Base64 from '@/utils/base64.js'
export default {
  data() {
    return {
      iframeWin: {}
    }
  },
  computed: {
    src() {
      return this.$route.query.view ? Base64.decode(this.$route.query.view) : ''
    }
  },
  methods: {
    loaded(e) {
      const cookie = document.cookie
      this.iframeWin.postMessage(cookie, this.src)
    }
  },
  mounted() {
    this.iframeWin = this.$refs.iframe.contentWindow
    var iframeElment = this.$refs.iframe
    if (iframeElment) {
      iframeElment.allow =
        'microphone;camera;midi;encrypted-media;fullscreen;speaker;display-capture;picture-in-picture;autoplay;'
    }
  }
}
</script>

<style lang="scss" scoped>
.live {
  width: 100%;
  height: 100vh;
  .iframe {
    width: 100%;
    height: 100%;
    border: none;
  }
}
</style>
